<template>
	<section class="jumbotron">
      <h3 class="jumbotron-heading">Search Github Users</h3>
      <div>
        <input type="text" placeholder="enter the name you search" v-model="keyword"/>&nbsp;<button @click="search">Search</button>
      </div>
    </section>
</template>

<script>
  import axios from 'axios';
	export default {
		name:'Search',
    data () {
      return {
        keyword:'liuboshu'
      }
    },
    methods: {
      search(){
        // 将需要判断的数据，用对象一起传过去
        // 请求前更新List的数据
        this.$bus.$emit('listObj',{isFirst:false,isLoading:true,errMsg:'',users:[]});
        axios.get(`https://api.github.com/search/users?q=${this.keyword}`).then(
          response =>{
            console.log('请求成功',response.data);
            //请求成功后更新List的数据
            this.$bus.$emit('listObj',{isLoading:false,errMsg:'',users:response.data.items});
          },
          error =>{
            console.log('请求失败',error.message);
            //请求失败后更新List的数据
            this.$bus.$emit('listObj',{isLoading:false,errMsg:'请求失败',users:[]});
          }
        )
      }
    }
	}
</script>
